import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import React, { useRef, useState, useEffect, useMemo, useCallback, } from "react";
import { Button } from "antd";
import CloudTemplatePopup from "../components/TemplatePopup/CloudTemplatePopup";
import { SelectBox } from "devextreme-react/select-box";
import DataSource from "devextreme/data/data_source";
import { RequiredRule } from "devextreme-react/form";
import Validator from "devextreme-react/validator";
import { templateListApi } from "./DraftApi";
import { intlEnum } from "./constant";
import "./_style.less";
const ENUM = {
    local: intlEnum.localDownload,
    cloud: intlEnum.cloudDownload,
};
const validationKeyName = "selectBoxCloudDownload";
const SelectBoxCloudDownload = (props, ref) => {
    const { onFinish, onChange, validationKey = validationKeyName } = props;
    console.log("props", props);
    const CloudPopupRef = useRef();
    const [dataGridData, setDataGridData] = useState([]);
    const getReportTemps = async () => {
        try {
            const res = await templateListApi();
            console.log("res-----", res);
            setDataGridData(res?.filter((a) => a.tempType ===
                (props?.cloudTempType === "合并系统模板"
                    ? props?.cloudTempType
                    : "报告系统模板")) || []);
        }
        catch (error) {
            console.log(error);
            setDataGridData([]);
        }
    };
    const init = async () => {
        await getReportTemps();
    };
    useEffect(() => {
        init();
    }, []);
    const showCloudDialog = () => {
        CloudPopupRef?.current.showTemplate();
    };
    const reloadCloudCallback = useCallback(async () => {
        await getReportTemps();
        onFinish && onFinish();
    }, []);
    const GroupRender = (data) => {
        const { key } = data;
        const categoryName = ENUM[key];
        return (_jsx(_Fragment, { children: key === "local" ? (_jsxs("div", { className: "flex justify-between items-center", children: [_jsx("span", { children: categoryName }), _jsx(Button, { type: "primary", size: "small", onClick: showCloudDialog, children: ENUM.cloud })] })) : (
            // 暂时为空
            _jsx(_Fragment, {})) }));
    };
    const onValueChange = (value) => {
        console.log("inner value", value);
        onChange && onChange(value);
    };
    const itemTemplate = (e) => {
        const { tempName, reportType } = e;
        return (_jsxs("div", { className: "flex justify-between items-center", children: [_jsx("div", { children: tempName }), _jsx("div", { children: reportType })] }));
    };
    const SelectGroup = useMemo(() => {
        const ungroupedData = Array.isArray(dataGridData)
            ? dataGridData.map((item) => {
                return {
                    ...item,
                    category: "local",
                    categoryName: ENUM[item.category || "local"],
                };
            })
            : [];
        return (_jsx(SelectBox, { displayExpr: "tempName", valueExpr: "tempName", placeholder: "\u8BF7\u9009\u62E9\u6A21\u7248", onValueChange: onValueChange, dataSource: new DataSource({
                store: {
                    type: "array",
                    data: ungroupedData,
                    key: props.primaryKey || "id",
                },
                group: "category",
                map(item) {
                    item.key = item.category;
                    item.categoryName = item.categoryName;
                    return item;
                },
            }), itemRender: itemTemplate, grouped: true, groupRender: GroupRender, ...props, children: _jsx(Validator, { validationGroup: validationKeyName, children: _jsx(RequiredRule, { message: "\u8BF7\u9009\u62E9\u6A21\u677F" }) }) }));
    }, [dataGridData]);
    return (_jsxs(_Fragment, { children: [SelectGroup, _jsx(CloudTemplatePopup, { ref: CloudPopupRef, cloudData: {
                    cloudTempType: "报告模板",
                }, reloadTable: reloadCloudCallback })] }));
};
export default React.memo(SelectBoxCloudDownload);
